import { getToken, setToken, removeToken, setTimeStamp } from '@/utils/auth'
import { login, getUserInfo, getUserDetailById } from '@/api/user'

const state = {
  token: getToken(), // 设置token初始状态   token持久化 => 放到Cookie中
  userInfo: {}
}
const mutations = {
  setToken(state, token) {
    // 设置 vuex 中的token
    state.token = token
    // 写入到 token 到 cookie
    setToken(token)
  },
  // 删除 token
  removeToken() {
    // 删除vuex的token
    state.token = null
    // 删除 cookie 中的token
    removeToken()
  },
  setUserInfo(state, userInfo) {
    // 响应式赋值
    state.userInfo = { ...userInfo }
  },
  // 删除用户信息
  reomveUserInfo(state) {
    state.userInfo = {}
  }
}
const actions = {
  // 执行用户登录
  async login(context, data) {
    // 调用 login 的 api 接口
    const token = await login(data)
    // actions 修改state， 必须通过mutations
    context.commit('setToken', token)
    // 写入时间戳
    setTimeStamp()
  },
  // 获取用户资料
  async getUserInfo(context) {
    // 调用 api 接口，获取用户资料
    const result = await getUserInfo()
    // 调用 api 接口，获取用户详细信息，包含用户图片
    const baseInfo = await getUserDetailById(result.userId)
    // 合并
    const baseResult = { ...result, ...baseInfo }
    context.commit('setUserInfo', baseResult) // 将整个的个人信息设置到用户的vuex数据中
    return result // 这里为什么要返回 为后面埋下伏笔
  },
  logout(context) {
    // 删除 token
    context.commit('removeToken')
    // 删除 用户信息
    context.commit('reomveUserInfo')
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
